@aBaseColor:#646464;
@backGColor:#0AAC84;
@hColor:#505050;
html{
    font-size: 10px;
}
/* 头部样式*/
header{
    width: 100%;
    height: 8rem;
    line-height: 8rem;
    background-color:@backGColor;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10;
    .logo{
        width: 15rem;
        height: 100%;
        a{
            display: block;
            height: 100%;
            img{
                display: block;
                width: 100%;
                width: 100%;
            }
        }
    }
    ul{
        height: 100%;
        li{
            float: left;
            width: 10rem;
            height: 100%;
            background-color:@backGColor;
            text-align: center;
            &.active{
                background-color: #008665;
            }
            a{
                color: #fff;
            }

        }
    }
}
/* 侧边选择栏*/
.select{
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9;
    background-color: #fff;
    width: 15rem;
    height: 100%;
    padding:8rem 1rem 0 1rem;
    box-sizing: border-box;
    overflow: hidden;
    box-shadow: 0 2px 8px #ebe5e5;
    ul{
        width: 100%;
        margin-top: 1.4rem;
        li{
            text-align: center;
            font-size: 1.5rem;
            line-height: 2.4rem;
            a{
                color:  @aBaseColor;
            }
            h4{
                font-weight: 600;
                font:1.8rem/4rem 'Yahei';
                border-bottom: 1px solid #ccc;
                color: @hColor;
            }
            &.key_word{
                margin-top: 1rem;
                h4{
                    font-size: 1.4rem;
                    text-align: left;
                    border-bottom: none;
                }
                .search{
                    height: 3rem;
                    line-height: 3rem;
                    input{
                        width: 70%;
                        height: 100%;
                        box-sizing: border-box;
                        outline: none;
                        border:none;
                        border-bottom: 1px solid #817d7d;
                        font-size: 1.2rem;
                    }
                    span{
                        width: 30%;
                        height: 100%;
                        color: rgb(153, 144, 144);
                    }
                }
                
            }
            &.price_sle{
                margin-top: 0.8rem;
                h4{
                    font-size: 1.4rem;
                    text-align: left;
                    border-bottom: none;
                }
                input{
                    width: 35%;
                }
            }
        }
    }
}
/*产品展示栏*/
.products{
    margin-top: 8rem;
    padding-left: 15rem;
    .products_content{
        padding: 0 4rem;
        height: 2000px;
        overflow: hidden;
        .pro_title{
            margin-top: 2rem;
            color: rgb(126, 122, 122);
            line-height: 5rem;
            font-size: 2.4rem;
            text-indent: 1.5rem;
        }
        .product_wrap{
            .pro_lists{
                position: relative;
                li{
                    padding:1.5rem 0 0 1.5rem;
                    box-sizing: border-box;
                    width: 25%;
                    float: left;
                    a{
                        display: block;
                        .pro_one{
                        padding: 1.2rem;
                        box-sizing: border-box;
                        border:1px solid #ccc;
                        border-radius: 10px;
                        box-shadow: 0 0 5px #ccc;
                        &:hover{
                            box-shadow:5px 5px 10px rgb(172, 160, 160);
                        }
                        .pro_pic{
                            width: 100%;
                            img{
                                width: 100%;
                                display: block;
                            }
                        }
                        .pro_info{
                                margin-top: 1rem;
                                font:1.4rem/2.2rem 'Yahei';
                                color: @aBaseColor;
                                p{
                                    height: 4.5rem;
                                }
                                .price{
                                    strong{
                                        font-size: 1.6rem;
                                        font-weight: 600;
                                        color: rgb(218, 78, 78);
                                    }
                                     .price_num{
                                        color: rgb(180, 75, 75);
                                    }
                                }
                                .sale{
                                    i{
                                        color: rgb(107, 207, 128);
                                    }
                                }
                               
                            }
                    }
                    }
                    
                    
                }
            }
        }
    }
}
